<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
	<title>Account Overview</title>
	<style type="text/css" media="screen">
		body { padding: 20px; }
		a:link, a:hover {
			color: #000;
			text-decoration: none;
		}
		a:hover, a:active { text-decoration: underline; }
		
		h1 { text-align: center; font-size: 120%; color: #666; }
		h2 { text-align: center; font-size: 100%; color: #666; }
		
		table { width: 100%; }
		tr.account:hover { text-decoration: underline; cursor: pointer; }
		th.name, td.name, th.transactions, td.transactions { text-align: left; width: 1px; white-space: nowrap; }
		th.amount, td.amount { text-align: right; width: 1px; white-space: nowrap; }
		th.type, td.type, th.date, td.date { text-align: left; width: 1px; white-space: nowrap; }
		td, th { padding: 0em 1em; }
	</style>

	<script type="text/javascript" charset="utf-8">
		var container = null;
		function addAccount(name, amount, transactions, type, date) {
			if (!container) { container = document.getElementById("container"); }
			
			var account = document.createElement("tr");
			account.setAttribute("class", "account");
			account.onclick = function() { client.loadAccount(name); }
			container.appendChild(account);

			var nameItem = document.createElement("td");
			nameItem.setAttribute("class", "name");
			account.appendChild(nameItem);
			
			var nameText = document.createTextNode(name);
			nameItem.appendChild(nameText);

			var transactionsItem = document.createElement("td");
			transactionsItem.setAttribute("class", "transactions");
			account.appendChild(transactionsItem);
			
			var transactionsText = document.createTextNode(transactions);
			transactionsItem.appendChild(transactionsText);

			var amountItem = document.createElement("td");
			amountItem.setAttribute("class", "amount");
			account.appendChild(amountItem);
			
			var amountText = document.createTextNode(amount);
			amountItem.appendChild(amountText);
			
			var typeItem = document.createElement("td");
			typeItem.setAttribute("class", "type");
			account.appendChild(typeItem);
			
			var typeText = document.createTextNode(type);
			typeItem.appendChild(typeText);
						
			var dateItem = document.createElement("td");
			dateItem.setAttribute("class", "date");
			account.appendChild(dateItem);
			
			var dateText = document.createTextNode(date);
			dateItem.appendChild(dateText);
		}
	</script>
</head>
<body>
	<h1>%title%</h1>
	<h2>%subtitle%</h2>
	<table id="container" cellspacing="0" cellpadding="0">
	<tr>
		<th class="name">%name%</th>
		<th class="transactions">%transactions%</th>
		<th class="amount">%amount%</th>
		<th class="type">%type%</th>
		<th class="date">%date%</th>
	</tr>
	</table>
</body>
</html>